<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>

        //课后练习：
        // var age = 100;
        // function func(){
        //     var f1 = () => {
        //         console.log(this.age);
        //     }
        //     return f1;
        // }

        // var obj = {
        //     age: 200
        // }

        // obj.sayHello = func();
        // obj.sayHello();


        //1. 箭头函数中，没有自己的this
        //2. 如果在箭头函数中访问this了, 那么使用的this就是外层作用域中的this

        //箭头函数中this指向不能再使用函数调用模式来分析了！

        // var obj = {
        //     age: 18,
        //     func: function(){
        //         var f = () => {
        //             console.log(this.age);
        //         }
        //         f();
        //     }
        // }

        // obj.func();


        // var age = 20;
        // var obj = {
        //     age: 18,
        //     func: () => {
        //         //this --> window
        //         //这是一个箭头函数，所this要向外找 外层作用域就是全局作用域
        //         //全局作用域中的this是window
        //         var f = () => {
        //             //this --> window
        //             //这是一个箭头函数，所this要向外找
        //             console.log(this.age);
        //         }
        //         f();
        //     }
        // }

        // obj.func();


        //箭头函数的使用场景：  所有需要使用var that = this解决的问题，都可以使用箭头函数来代替


        //箭头函数没有this，既是一个好处，也是一个坑。
        //所以使用箭头函数，一定要考虑清楚this的指向。




        //复习：
        //1. 箭头函数中没有this，如果用到了this,就按照变量的查找规则沿着作用域链向上查找

        //2. 普通函数中this的指向，需要通过确定调用模式来找
        //3. 而箭头函数中的this指向，只需要按照变量的查找规则向上查找就行

        // var age = 20;
        // var obj = {
        //     age: 18,
        //     func: () => {
        //         //this --> window
        //         //这是一个箭头函数，所this要向外找 外层作用域就是全局作用域
        //         //全局作用域中的this是window
        //         var f = () => {
        //             //this --> window
        //             //这是一个箭头函数，所this要向外找
        //             console.log(this.age);
        //         }
        //         f();
        //     }
        // }

        // obj.func();



        // var age = 100;
        // function func(){
        //     var f1 = () => {
        //         console.log(this.age);
        //     }
        //     return f1;
        // }

        // var obj = {
        //     age: 200
        // }

        // obj.sayHello = func();
        // obj.sayHello();

    </script>
</body>

</html>